@import "./common";

body {
    header {
        nav {
            padding: getvw(48) getvw(22) getvw(18);
        }
    }

    main {

        .banner {
            display: flex;
            flex-flow: wrap;
            justify-content: space-around;

            .circle {
                width: getvw(149);

                .imgBox {
                    img {
                        width: 100%;
                        display: block;
                    }
                }

                p {
                    font-size: getvw(26);
                    margin-top: getvw(10);
                    text-align: center;
                }
            }

            .spotBox {
                width: getvw(120);
                text-align: center;

                span {
                    display: inline-block;
                    width: getvw(18);
                    height: getvw(18);
                    border-radius: 50%;
                    background-color: #ff9344;
                    opacity: 0.5;

                    &:first-child {
                        opacity: 1;
                    }
                }
            }
        }

        .cont {

            .cate,
            .film,
            .motion,
            .sing {
                margin-bottom: getvw(50);

                .titleBox {
                    position: relative;

                    >i {
                        font-size: getvw(70);
                        color: #ff9344;
                    }

                    span {
                        font-size: getvw(30);
                        line-height: getvw(80);
                        position: absolute;

                        &:first-of-type {
                            font-weight: 600;
                            left: getvw(80);
                        }

                        &:last-of-type {
                            font-size: getvw(24);
                            right: 0;

                            .icon-xiangyou3 {
                                font-size: getvw(26);
                                color: #ff9344;
                                margin-left: getvw(8);
                            }
                        }
                    }
                }

                .imgBox {
                    margin-top: getvw(15);
                    display: flex;
                    justify-content: space-between;

                    img {
                        display: block;
                        width: getvw(135);
                        height: getvw(135);
                    }
                }
            }
        }
    }
}